<div id="auth">
	<div class="layui-fluid form-cont" style="padding: 30px; overflow: auto;">
		<div id="menu"></div>
	</div>
	<div class="form-btn">
	    <input type="button" value="保存" class="layui-btn" @click="submit">
	</div>
</div>
<script>
	layui.use(['tree', 'util'], function(){
	  var tree = layui.tree
	    ,util = layui.util;
	   var auth=new Vue({
	   	el:'#auth',
	   	data:{
	   		list:[],
			detail:{},
			type:layui.admin.objData.type
	   	},
	   	mounted:function(){
	   		var _this=this;
			if(this.type!=1) this.detail=layui.admin.objData.detail;
	   		layui.admin.ajax('menu/list',{},1).then(function(res){
	   			var menu=res.data.list,menus=[],ids=_this.detail.module_id_array.split(',');
	   			for(var i=0; i<menu.length; i++){
					menu[i].checked=false;
					for(var d=0;d<ids.length;d++){
						if(ids[d]==menu[i].module_id){
							menu[i].checked=true;
						}
					}
	   				if(menu[i].level===1){
	   					menus.push({
							title:menu[i].module_name,
							id:menu[i].module_id,
							spread: true,
							children:[],
							checked:menu[i].checked
						});
	   				}
	   			}
				for(var i=0; i<menu.length; i++){
					for(var j=0; j<menus.length; j++){
						if(menu[i].pid==menus[j].id){
							menus[j].children.push({
								title:menu[i].module_name,
								id:menu[i].module_id,
								children:[],
								checked:menu[i].checked
							});
						}
					}
				}
				for(var i=0; i<menu.length; i++){
					for(var j=0; j<menus.length; j++){
						for(var k=0; k<menus[j].children.length; k++){
							if(menu[i].pid==menus[j].children[k].id){
								menus[j].children[k].children.push({
									title:menu[i].module_name,
									id:menu[i].module_id,
									checked:menu[i].checked
								});
							}
						}
					}
				}
				for(var i=0; i<menus.length;i++){
					if(menus[i].children.length){
						menus[i].checked=false;
						for(var j=0; j<menus[i].children.length; j++){
							if(menus[i].children[j].children.length){
								menus[i].children[j].checked=false;
							}
						}
					}
				}
				tree.render({
				  elem: '#menu'
				  ,data: menus
				  ,showCheckbox: true 
				  ,id: 'menu'
				  ,click: function(obj){
				    
				  }
				});
	   		}).catch(function(res){});
	   	},
	   	methods:{
	   		submit(){
				var data = tree.getChecked('menu'),ids;
				for(var i=0; i<data.length;i++){
					if(ids){
						ids+=','+data[i].id;
					}else{
						ids=data[i].id;
					}
					if(data[i].children.length){
						for(var j=0; j<data[i].children.length;j++){
							ids+=','+data[i].children[j].id;
							if(data[i].children[j].children.length){
								for(var k=0; k<data[i].children[j].children.length;k++){
									ids+=','+data[i].children[j].children[k].id;
								}
							}
						}
					}
				}
				layui.admin.formapi('role/get_menu',{
					role_id:this.detail.role_id,
					moudle_ids:ids
				});
			}
	   	}
	   });
	})
</script>
